import {Component} from "react";
import {View} from "@tarojs/components";
import Item from "./item";
import './index.scss'

export default class VerticalTabs extends Component {
  constructor(props) {
    super(props);
    this.state = {
      list: props.list
    }

  }
  upDataList = function (activeObj) {
    this.state.list.forEach(item => {
      item.active = item.name === activeObj.name;
    })
    this.setState({ list: this.state.list });
  }
  render() {
    const { list } = this.state
    return (
      <View className='vertivalTabs'>
        {
          list.map((item, index) => {
            return <Item
              key={index}
              item={item}
              list={list}
              upDataList={this.upDataList.bind(this)}
            />
          })
        }
      </View>
    )
  }
}
